css: padding百分比详解

今天来介绍一个我们经常用到的css属性padding。但是它有一个我们不常使用的值，那就是百分比！

padding的百分比是相对于父元素宽度，如果父元素有宽度，相对于父元素宽度，如果没有，找其父辈元素的宽度，均没设宽度时，相对于屏幕的宽度。

1、padding的所有值相对于屏幕宽度

2、padding的所有值相对于父元素的宽度

1、使用padding实现

2、使用vw实现

vw的兼容性如下：

由图可看出vw的支持情况。PC端的话，IE支持还不是特别好，其他都还OK。移动端的话 ，android和iOS，基本没有问题，android 4.4和iOS8以上都支持了。

对于PC端来说，我们可以随意设置图片的宽高，但是在移动端，随着各手持设备屏幕的宽度的不同，我们没有办法给满屏图片设置固定宽高，这时候padding就很有作用了。我们可以给图片设置固定的宽高比，也可以给图片外层加一个固定宽高比的盒子，来达到图片的自适应。